<template>
    <div>
        <iframe class="iframe" :src="url"></iframe>
    </div>
</template>

<script>
import { getDetail } from "@/api/case";
import { CountDown } from "vant";
import pdf from 'vue-pdf'

export default {
    components: { CountDown, pdf },
    data() {
        return {
            baseUrl: process.env.VUE_APP_BASE_API,
            id: "",
            form: {},
            url: "",
            mp4: false,
            pdf: false,
            ppt: false,
            time: 0,
            title: "",
            pageNum: 1,
            pageTotalNum: 1, // 总页数
            loadedRatio: 0,
            numPages: null, // pdf 总页数
        };
    },
    created() {
        this.id = this.$route.query.id;

    },
    mounted: function () {
        this.getDetail();
    },
    methods: {
        // 上一页
        prePage() {
            let page = this.pageNum
            page = page > 1 ? page - 1 : this.pageTotalNum
            this.pageNum = page
        },

        // 下一页
        nextPage() {
            let page = this.pageNum
            page = page < this.pageTotalNum ? page + 1 : 1
            this.pageNum = page
        },
        getDetail() {
            let params = { id: this.id };
            const _this = this;
            getDetail(params).then((res) => {
                if (res.data.AttMiddlePath.indexOf("http") == -1) {
                    //this.url = this.baseUrl + res.data.AttMiddlePath;
                    _this.url =
                        this.baseUrl +
                        "/Plugins/pdfjs/web/viewer.html?file=" +
                        res.data.AttMiddlePath;
                } else {
                    _this.url =
                        "/Plugins/pdfjs/web/viewer.html?file=" + res.data.AttMiddlePath;
                }
                let loadingTask = pdf.createLoadingTask(this.url)
                loadingTask.promise
                    .then((pdf) => {
                        this.numPages = pdf.numPages
                    })
                    .catch((err) => {
                        console.error('pdf 加载失败', err)
                    })
                this.form = res.data;
            });
        },
    },
};
</script>

<style lang="less" scoped>
.video-hd {
    z-index: 99;
    width: 100%;
    position: fixed;
    bottom: 0;
    left: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px;
    font-size: 14px;
    color: #fff;
    background-color: rgba(0, 0, 0, 0.5);
}
.video-hd > div {
    display: flex;
    align-items: center;
}
.video {
    width: 100%;
    height: auto;
}
.iframe {
    width: 100%;
    height: calc(100vh);
}
// .fixed {
// 	position: fixed;
// 	top: 0;
// 	left: 0;
// 	bottom: 0;
// 	right: 0;
// 	background: #000;
// }

// .transform-rotate {
// 	position: fixed;
// 	top: 0;
// 	bottom: 0;
// 	transform-origin: 0 50%;
// 	transform: rotate(90deg) translate(-50%, -4%);
// }
</style>